/* main properties */
body {
	background-attachment: fixed;
	background-image: url(../graphics/background-main.jpg);
	background-repeat: repeat;
	background-position: center top;
	background-color: #1e1e1e;
	font-family: 'Copse', serif;
}
#map {
	background-image: url(../graphics/background-maps.png);
	background-repeat: repeat;
	background-attachment: fixed;
}
#ufo {
	background-image: url(../graphics/background-ufo.png);
	background-repeat: repeat-y;
	background-attachment: fixed;
}
h1 { /* HTML5 sectioning */
	height: 1px;
	width: 1px;
	overflow: hidden;
}
h2 {
	font-family: 'Copse', serif;
	font-size: 40px;
	color: #000;
	font-weight: 700;
	letter-spacing: -1px;
}
p {
	font-family: 'Varela', sans-serif;
	font-size: 16px;
	line-height: 20px;
	padding-bottom: 0px;
}
h2::selection, .date-comic::selection, .date-blog::selection, .date-work::selection, .ego-title::selection, .ego-date::selection, p::selection, a::selection {
	background:#b49e6a;
	color:#000;
}
h2::-moz-selection, .date-comic::-moz-selection, .date-blog::-moz-selection, .date-work::-moz-selection, .ego-title::-moz-selection, .ego-date::-moz-selection, p::-moz-selection, a::-moz-selection {
	background:#b49e6a;
	color:#000;
}
h2::-webkit-selection, .date-comic::-webkit-selection, .date-blog::-webkit-selection, .date-work::-webkit-selection, .ego-title::-webkit-selection, .ego-date::-webkit-selection, p::-webkit-selection, a::-webkit-selection {
	background:#b49e6a;
	color:#000;
}
/* end main properties */

/* header */
#header {
	width: 100%;
	z-index: 100;
	position: fixed;
	background-image: url(../graphics/background-header.png);
	background-repeat: repeat-x;
	background-position: center top;
	height: 120px;
	margin-top: -1px;
}
	#nav {
		height: 78px;
		width: 978px;
		margin-right: auto;
		margin-left: auto;
		margin-top: 17px;
	}
/* logo */
		#top {
			display: block;
			height: 78px;
			width: 198px;
			float: left;
		}
/* end logo */
/* navigation */
		#nav-buttons {
			float: left;
			height: 78px;
			margin-left: 360px;
			width: 420px;
		}
			#nav-comic {
				background-image: url(../graphics/nav-comic.png);
				background-repeat: no-repeat;
				background-position: center center;
				float: left;
				height: 78px;
				width: 120px;
			}
			#nav-comic:hover {
				background-image: url(../graphics/nav-comic-hover.png);
			}
			#nav-work {
				background-image: url(../graphics/nav-work.png);
				background-repeat: no-repeat;
				background-position: center center;
				float: left;
				height: 78px;
				width: 115px;
			}
			#nav-work:hover {
				background-image: url(../graphics/nav-work-hover.png);
			}
			#nav-blog {
				background-image: url(../graphics/nav-blog.png);
				background-repeat: no-repeat;
				background-position: center center;
				float: left;
				height: 78px;
				width: 90px;
			}
			#nav-blog:hover {
				background-image: url(../graphics/nav-blog-hover.png);
			}
			#nav-ego {
				background-image: url(../graphics/nav-ego.png);
				background-repeat: no-repeat;
				background-position: center center;
				float: left;
				height: 78px;
				width: 95px;
			}
			#nav-ego:hover {
				background-image: url(../graphics/nav-ego-hover.png);
			}
/* end navigation */
/* end header */

/* comic section */
#comic {
	background-image: url(../graphics/background-comic.png);
	background-repeat: no-repeat;
	background-position: center top;
	height: 1400px;
	width: 100%;
	min-width: 978px;
}
	#comic-content {
		height: 400px;
		width: 758px;
		padding-top: 250px;
		padding-left: 55px;
		margin-right: auto;
		margin-left: auto;
	}
/* comic slides (portfolio blob) */
		.section {
			width:758px;
		}
		#portfolio-entries {
			overflow: hidden;
		}
		.description {
			height: 77px;
		}
			.date-comic {
				font-size: 16px;
				font-weight: 600;
				color: #b49e6a;
				text-align: right;
				height: 18px;
				width: 400px;
				display: block;
				padding-top: 2px;
			}
			.comic { /* h2 .comic */
				margin-left: 15px;
			}
/* end comic slides */
/* comic controls (portfolio blob) */
		#portfolio-controls {
			margin-top: 9px;
			z-index: 0;
			margin-left: 580px;
		}
		#portfolio-controls #previous {
			display: inline-block;
			width: 73px;
			height: 63px;
			cursor: pointer;
			float:left;
			background-image: url(../graphics/comic-navy-prev.png);
			background-repeat: no-repeat;
			background-position: center center;
		}
		#portfolio-controls #next {
			display: inline-block;
			width: 93px;
			height: 63px;
			cursor: pointer;
			float:left;
			background-image: url(../graphics/comic-navy-next.png);
			background-repeat: no-repeat;
			background-position: center center;
		}
		#portfolio-controls #previous:hover {
			background-image: url(../graphics/comic-navy-prev-hover.png);
		}
		#portfolio-controls #next:hover {
			background-image: url(../graphics/comic-navy-next-hover.png);
		}
/* end comic controls */
/* end comic section */

/* blog section */
#blog-header {
	background-image: url(../graphics/background-blog-header.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 350px;
	width: 978px;
	margin-right: auto;
	margin-left: auto;
}
#blog-content {
	background-image: url(../graphics/background-blog-content.png);
	background-repeat: repeat-y;
	background-position: center top;
	width: 668px;
	margin-right: auto;
	margin-left: auto;
	padding-right: 140px;
	padding-left: 170px;
}
	.date-blog {
		font-size: 16px;
		font-weight: 600;
		color: #fff;
		padding-left: 10px;
	}
	.blog { /* h2 blog */
		background-image: url(../graphics/blog-title.png);
		background-repeat: no-repeat;
		background-position: left top;
		height: 75px;
		width: 322px;
		padding-left: 15px;
		padding-top: 25px;
	}
		#blog p a {
			color: #F3E9D0;
		}
		#blog p a:hover {
			color: #000;
		}
	hr {
		background-image: url(../graphics/blog-hr.png);
		background-repeat: no-repeat;
		display: block;
		height: 60px;
		width: 100%;
		border: none;
		margin: 0px;
		padding: 0px;
	}
#blog-footer {
	background-image: url(../graphics/background-blog-footer.png);
	background-repeat: no-repeat;
	background-position: center top;
	height: 755px;
	width: 978px;
	margin-right: auto;
	margin-left: auto;
}
/* end blog section */

/* work section */
#work-header {
	background-image: url(../graphics/background-work-header.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 390px;
	width: 978px;
	margin-right: auto;
	margin-left: auto;
}
	#work-content {
		background-repeat: repeat-y;
		background-position: center top;
		width: 978px;
		margin-right: auto;
		margin-left: auto;
		background-image: url(../graphics/background-work-content.png);
	}
		.texts {
			width: 668px;
			margin-right: auto;
			margin-left: auto;
			padding-right: 140px;
			padding-left: 170px;
		}
			.date-work {
				font-size: 16px;
				font-weight: 600;
				color: #fff;
				padding-left: 10px;
			}
			.work { /* h2 work */
				background-image: url(../graphics/work-title.png);
				background-repeat: no-repeat;
				background-position: left top;
				height: 70px;
				width: 322px;
				padding-left: 15px;
				padding-top: 30px;
			}
			#work p {
				color: #fff;
			}
			#work p a {
				color: #b49e6a;
			}
			#work p a:hover {
				color: #fff;
			}
		.works {
			background-image: url(../graphics/work-content.png);
			background-repeat: no-repeat;
			background-position: center top;
			height: 410px;
			width: 978px;
			padding-bottom: 20px;
		}
			.works img {
				height: 361px;
				width: 807px;
				overflow: hidden;
				position: relative;
				left: 86px;
				top: 30px;
			}
		.no-works {
			height: 35px;
		}
#work-footer {
	background-image: url(../graphics/background-work-footer.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 500px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
	#work-xtra {
		background-image: url(../graphics/work-footer-xtra.png);
		background-repeat: no-repeat;
		background-position: center top;
		height: 45px;
		width: 306px;
		margin-right: auto;
		margin-left: auto;
	}
/* end work section */

/* ego section */
#ego-header {
	background-image: url(../graphics/background-ego.png);
	background-repeat: no-repeat;
	background-position: center top;
	height: 320px;
	width: 100%;
	min-width: 978px;
	margin-right: auto;
	margin-left: auto;
}
#ego-content {
	width: 978px;
	margin-right: auto;
	margin-left: auto;
}
	#ego-texts {
		padding-top: 50px;
		width: 778px;
		margin-right: auto;
		margin-left: auto;
		padding-right: 30px;
		padding-left: 170px;
		padding-bottom: 30px;
	}
	#ego p {
		color: #f3e9cf;
	}
#ego-footer {
	height: 110px;
	width: 978px;
	margin-right: auto;
	margin-left: auto;
}
	#ego-log {
		background-image: url(../graphics/ego.png);
		background-repeat: no-repeat;
		background-position: center center;
		height: 110px;
		width: 245px;
		margin-left: 700px;
	}
		.ego-title {
			font-family: 'Copse', serif;
			font-size: 28px;
			font-weight: 700;
			display: block;
			padding-top: 22px;
			padding-left: 30px;
			letter-spacing: -1px;
		}
		.ego-date {
			font-family: 'Copse', serif;
			font-size: 16px;
			font-weight: 600;
			display: block;
			padding-top: 12px;
			padding-left: 44px;
			letter-spacing: -1px;
			color:#fff;
			text-decoration: none;
		}
/* end ego section */

/* footer */
#footer {
	background-image: url(../graphics/background-footer.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 650px;
	width: 100%;
	min-width: 978px;
}
	#contact-line {
	margin-right: auto;
	margin-left: auto;
	width: 600px;
	padding-top: 280px;
	height: 120px;
	display: block;
	}
		#eye-contact {
			width: 230px;
			height: 120px;
			display: block;
		}
	#bottom-line {
		padding-top: 200px;
		margin-right: auto;
		margin-left: auto;
		width: 978px;
		text-align: center;
	}
		#footer p {
			font-family: 'Copse', serif;
			font-size: 14px;
			color: #b49e6a;
		}
		#footer p a {
			color: #000;
			text-decoration: none;
		}
		#footer p a:hover {
			text-decoration: underline;
		}
/* end footer */
